<!-- 项目组任命书 -->
<template>
	<view style="">
		<!-- 签名板 -->
		<!-- <view class="xiaolu" style="" v-if="vShow">
			<xiaolu ref="xiaolu" @getImg="getImg">{{ v }}</xiaolu>
		</view> -->
		<!-- 项目进度按钮 -->
		<view class="all_project_head_btn" style="">
			<project-button :projectId="project_id" stageName="项目组任命书"></project-button>
			<step-button :approvalLog="addFormData.approval_log" :processList="stepProcessList"
				v-if="addFormData.approval_log != null"></step-button>
		</view>
		<form action="">
			<!-- 项目名称 -->
			<view class="info_item">
				<text class="all_text_title">项目名称</text>
				<input
					disabled
					style="margin-top: 39rpx;"
					placeholder-style="font-size:30rpx"
					:value="S_project_name"
				/>
			</view>
			<!-- 评价类型 单选 -->
			<view class="info_item">
				<text class="all_text_title">评价类型</text>
				<input
					disabled
					style="margin-top: 39rpx;"
					placeholder-style="font-size:30rpx"
					:value="S_pte_name"
				/>
			</view>
			<!-- 委托单位 -->
			<view class="info_item">
				<text class="all_text_title">委托单位</text>
				<input
					disabled
					style="margin-top: 39rpx;"
					placeholder-style="font-size:30rpx"
					:value="S_company_name"
				/>
			</view>
			<!-- 企业地址 -->
			<view class="info_item">
				<text class="all_text_title">企业地址</text>
				<input
					:disabled="!isSubmit"
					v-model="addFormData.enterprise_address"
					style="margin-top: 39rpx;"
					placeholder-style="font-size:30rpx"
					value=""
				/>
			</view>

			<!-- 外部项目编号 -->
			<view class="info_item">
				<text class="all_text_title">外部项目编号</text>
				<input
					:disabled="!isSubmit"
					v-model="addFormData.item_code"
					style="margin-top: 39rpx;"
					placeholder-style="font-size:30rpx"
					value=""
				/>
			</view>

			<!-- 企业联系人 -->
			<view class="info_item">
				<text class="all_text_title">企业联系人</text>
				<input
					:disabled="!isSubmit"
					v-model="addFormData.enterprise_contacts"
					style="margin-top: 39rpx;"
					placeholder-style="font-size:30rpx"
					value=""
				/>
			</view>
			<!-- 联系方式 -->
			<view class="info_item">
				<text class="all_text_title">联系方式</text>
				<input
					:disabled="!isSubmit"
					v-model="addFormData.enterprise_contact"
					style="margin-top: 39rpx;"
					placeholder-style="font-size:30rpx"
					value=""
				/>
			</view>

			<!-- 计划开始日期 -->
			<view class="info_item" style="position: relative;">
				<text class="all_text_title">计划开始日期</text>
				<picker mode="date" @change="setDate1" class="picker1">
					<view>{{ start_date }}</view>
				</picker>
				<image src="../../../static/project/date.png" class="date"></image>
			</view>
			<!-- 计划结束日期 -->
			<view class="info_item" style="position: relative;">
				<text class="all_text_title">计划结束日期</text>
				<picker mode="date" @change="setDate2" class="picker1">
					<view>{{ end_date }}</view>
				</picker>
				<image src="../../../static/project/date.png" class="date"></image>
			</view>
			
			<!-- 附件上传提示 -->
			<view class="info_item" style="border-bottom: 0; color: #40A0F2;font-size: 26rpx;" @click="getMuBan()">
				<text style="color: #FF5A5F;">*请上传</text>
				<text style="color: #40A0F2;">项目组任命书</text>
			</view>
			
			<!-- 附件上传 -->
			<view class="info_item" style="border: 0;">
				<upload-file
					:isSubmit="isSubmit"
					:imgList="addFormData.annex"
					:detailsImgList="detailsImgList"
					@my-upload-change="upLoadChange"
				></upload-file>
			</view>

			<!-- 评价组成员 -->
			<view class="info_item">
				<view style="display: flex;flex-direction: row;">
					<text class="all_text_title">评价组成员</text>
					<view v-if="isSubmit" class="add_user" @click="addUser()">添加成员</view>
				</view>
				<view class="line" style="background: #F7F7F7;margin-top: 34rpx;">
					<view class="line_item" style="width: 105rpx;">姓名</view>
					<view class="line_item" style="width: 227rpx;">资质证书编号</view>
					<view class="line_item" style="width: 122rpx;">人员专业</view>
					<view class="line_item" style="width: 122rpx;">承担工作</view>
					<view class="line_item" style="width: 100rpx;">操作</view>
				</view>
				<view class="line" style="color: #666666;" v-for="(item, index) in pj_users">
					<view class="line_item" style="width: 105rpx;">
						<input
							:disabled="!isSubmit"
							type="text"
							@input="inputData(e, item)"
							v-model="item.nickname"
						/>
					</view>
					<view class="line_item" style="width: 227rpx;">
						<input :disabled="!isSubmit" type="text" v-model="item.number" />
					</view>
					<view class="line_item" style="width: 122rpx;">
						<input :disabled="!isSubmit" type="text" v-model="item.major" />
					</view>
					<view class="line_item" style="width: 122rpx;">
						<input :disabled="!isSubmit" type="text" v-model="item.work" />
					</view>
					<view
						class="line_item"
						style="width: 100rpx;color: #128BF1;"
						@click="deleteUser(index)"
					>
						删除
					</view>
				</view>
			</view>
			<!-- 任务内容及要求 -->
			<view class="info_item" style="border-bottom: 0;">
				<text class="all_text_title">任务内容及要求</text>
				<view class="work_text1">
					<text style="margin-top: 26rpx;">1.负责与企业对接，沟通报告相关事宜；</text>
					<text style="margin-top: 26rpx;">2.按照要求完成报告的编制和修订工作；</text>
					<text style="margin-top: 26rpx;">3.负责现场勘查，记录现场勘查内容；</text>
					<text style="margin-top: 26rpx;">4.客观、公正、严谨的编制报告；</text>
					<text style="margin-top: 26rpx;">
						5.到达企业后，注意自身安全，佩戴劳动防护用品，按照企业规 章制度开展工作。
					</text>
				</view>
				<view class="work_text2">
					<text style="margin-left: 48rpx;">
						根据本机构工作计划安排，特任命以上人员为评价组成员，
					</text>
					任命<text style="color: #40A0F2;">{{addFormData.evaluators.nickname}}</text>担任本次评价组长，现将有关信息通知您，请做好评价准备
					工作并将评价过控材料上交公司。
				</view>
				<!-- <view class="qianzi">
					<view class="qianzi1" style="margin-top: 30rpx;">
						<text v-if="isSubmit" @click="startSign1()">总经理 (签字) :</text>
						<text v-else>总经理 (签字) :</text>
						<image
							:src="v"
							mode=""
							style="width: 100rpx;height: 200rpx;transform: rotate(-90deg);"
						></image>
					</view>
				</view> -->
			</view>

			<view
				class="info_item"
				v-if="addFormData.is_approve == 1 && details_project_status == '14'"
				style="border-bottom: 0;"
			>
				<text class="all_text_title">审批备注</text>
				<textarea
					v-model="approval_remark"
					class="texta"
					maxlength="-1"
					auto-height="true"
				/>
			</view>
			<view v-if="addFormData.is_approve == 1 && details_project_status == '14'" style="width: 100%;height: 300rpx;">
				
			</view>
			<!-- 底部按钮 -->
			<view class="bottom" v-if="addFormData.is_edit != '1'">
				<button
					class="bottom_btn"
					style="background: #CCCCCC; width: 380rpx;"
					form-type="reset"
					@click="handleSubmit('1')"
				>
					保存草稿
				</button>
				<button
					@click="handleSubmit('0')"
					class="bottom_btn"
					style="background: linear-gradient(0deg, #037CE3, #2EB3FF); margin-top: -88rpx;margin-left: 50%;"
					form-type="submit"
				>
					提交
				</button>
			</view>
			<!-- 可撤回时显示 -->
			<view class="bottom" v-if="addFormData.is_edit == 1 && addFormData.withdraw_status == 1 && addFormData.is_approve != 1">
				<button
					class="bottom_btn"
					@click="handleWithdraw()"
					style="background: #DD524D; width: 100%;"
					form-type="reset"
				>
					撤回
				</button>
			</view>
			<!-- 审批 -->
			<view
				class="bottom"
				v-if="addFormData.is_approve == 1 && details_project_status == '14' && addFormData.withdraw_status != 1"
			>
				<button
					class="bottom_btn"
					style="background: #CCCCCC; width: 380rpx;"
					form-type="reset"
					@click="handleExamine('-1')"
				>
					驳回
				</button>
				<button
					@click="handleExamine('1')"
					class="bottom_btn"
					style="background: linear-gradient(0deg, #037CE3, #2EB3FF); margin-top: -88rpx;margin-left: 50%;"
					form-type="submit"
				>
					审批通过
				</button>
			</view>
			<!-- 可撤回时显示 -->
			<view class="bottom2" v-if="addFormData.is_approve == 1 && addFormData.withdraw_status == 1">
				<button
					class="bottom_btn2"
					@click="handleWithdraw()"
					style="background: #FF5A5F; margin-left: 0;"
					form-type="reset"
				>
					撤回
				</button>
				<button
					class="bottom_btn2"
					@click="handleExamine('-1')"
					style="background: #CCCCCC;margin-left: 33%;"
					form-type="reset"
				>
					驳回
				</button>
				<button
					class="bottom_btn2"
					style="background: linear-gradient(0deg, #037CE3, #2EB3FF);margin-left: 66%;"
					@click="handleExamine('1')"
					form-type="submit"
				>
					审批通过
				</button>
			</view>
		</form>
	</view>
</template>

<script>
import xiaolu from '@/components/xiaolu-signature/index.vue';
import UploadFile from '@/components/upload-file.vue';
import ProjectButton from '@/components/project-button.vue';
import StepButton from '@/components/step-button.vue';
export default {
	components: {
		UploadFile,
		ProjectButton,
		StepButton,
		xiaolu
	},
	data() {
		return {
			stepProcessList:{
					stage_code:'',
					project_id:''
					},
			s1: '', //总经理签名
			s2: '', //项目组长签名
			start_date: '请选择开始时间',
			end_date: '请选择结束时间',
			approval_remark: '',
			pj_users: [],
			isSubmit: true,
			detailsImgList: [],
			addFormData: {
				annex: '',
				enterprise_address: '',
				enterprise_contacts: '',
				enterprise_contact: '',
				start_date: '',
				item_code: '',
				end_date: '',
				member_json: '',
				sign_manager: '',
				// sign_leader: '',
				evaluators:{
					nickname:''
				}
			},
			vShow: false,
			v: '',
			S_project_name: '',
			S_company_name: '',
			S_pte_name: '',
			projectPjList: [],
			details_project_status: '',
			token: '',
			member_id: '',
			company_id: '',
			project_id: ''
		};
	},
	async onLoad(options) {
		this.token = uni.getStorageSync('btlh_process_token') || '';
		this.member_id = uni.getStorageSync('btlh_process_member_id') || '';
		this.company_id = uni.getStorageSync('bthl_process_LoginCompanyId') || '';
		this.getPjTypeList();

		this.details_project_status = options.details_project_status || '';
		this.project_id = options.project_id || '';
		console.log(this.project_id);
		if (this.project_id) {
			setTimeout(() => {
				this.getProjectDetails();
			});
		}
	},
	// 开启微信发送给朋友
	//#ifdef MP-WEIXIN
	onShareAppMessage() {
		return{
			title:this.addFormData.project_name,
			path:'/packageProject/pages/project/projectAppoint?project_id='+this.project_id+'&details_project_status='+this.details_project_status
		}
	},
	//#endif
	methods: {
		// 点击复制模板链接
		getMuBan(){
			uni.setClipboardData({
			    data: 'http://control.sxpz.vip/Template/安全评价项目组任命书.doc',
			    success: function () {
			        uni.showToast({
			        	title:'复制成功'
			        })
			    }
			});
		},
		
		// 点击撤回
		async handleWithdraw(){
			const { data: res } = await this.$myRequest({
				url: 'Project/withdraw',
				method: 'GET',
				data: {
					member_id: this.member_id,
					token: this.token,
					company_id: this.company_id,
					project_id:this.project_id
				}
			});
			if (res.code != 200)
				return uni.showToast({
					title: res.datas.msg,
					icon: 'none'
				});
				uni.navigateBack({
					delta:1
				})
		},
		// 审批通过
		async handleExamine(val) {
			const { data: res } = await this.$myRequest({
				url: 'Project/appointment_approval',
				method: 'POST',
				data: {
					member_id: this.member_id,
					token: this.token,
					company_id: this.company_id,

					project_id: this.project_id,
					approval_status: val,
					remark: this.approval_remark
				}
			});
			if (res.code != 200)
				return uni.showToast({
					title: res.datas.msg,
					icon: 'none'
				});
			uni.showToast({
				title: res.datas.msg,
				icon: 'none'
			});
			/* uni.navigateTo({
				url: `/packageProject/pages/project/projectManagement`
			}); */
			uni.navigateBack({
				delta: 1
			})
		},
		// 编辑
		async handleSubmit(val) {
			if (this.start_date != '请选择开始时间') {
				this.addFormData.start_date = this.start_date;
			}
			if (this.end_date != '请选择结束时间') {
				this.addFormData.end_date = this.end_date;
			}
			const { data: res } = await this.$myRequest({
				url: 'Project/appointment',
				method: 'POST',
				data: {
					member_id: this.member_id,
					token: this.token,
					company_id: this.company_id,
					project_id: this.project_id,

					is_draft: val,

					annex: JSON.stringify(this.submitImgList),
					enterprise_address: this.addFormData.enterprise_address,
					item_code: this.addFormData.item_code,
					enterprise_contacts: this.addFormData.enterprise_contacts,
					enterprise_contact: this.addFormData.enterprise_contact,
					start_date: this.addFormData.start_date,
					end_date: this.addFormData.end_date,
					member_json: JSON.stringify(this.pj_users),
					sign_manager: this.v
				}
			});
			if (res.code != 200)
				return uni.showToast({
					title: res.datas.msg,
					icon: 'none'
				});
			uni.showToast({
				title: res.datas.msg,
				icon: 'none'
			});
			/* uni.navigateTo({
				url: `/packageProject/pages/project/projectManagement`
			}); */
			uni.navigateBack({
				delta: 1
			})
		},
		// 获取项目详情
		async getProjectDetails() {
			const { data: res } = await this.$myRequest({
				url: 'Project/appointment_detail',
				method: 'POST',
				data: {
					member_id: this.member_id,
					token: this.token,
					company_id: this.company_id,

					project_id: this.project_id
				}
			});
			if (res.code != 200)
				return uni.showToast({
					title: res.datas.msg,
					icon: 'none'
				});
			// 判断是否首次进入次流程
			if (res.datas.info.is_new != 1) {
				this.addFormData = res.datas.info;
			}else{
				this.addFormData.is_edit = res.datas.info.is_edit
			}
			// 判断禁用
			if (this.addFormData.is_draft != '1' && this.addFormData.is_edit == '1') {
				this.isSubmit = false;
			}
			this.stepProcessList.project_id = this.addFormData.project_id;
			this.stepProcessList.stage_code = this.addFormData.project_status;
			// 禁用值
			this.S_project_name = res.datas.info.project_name;
			this.S_company_name = res.datas.info.company_name;
			this.S_pte_name = res.datas.info.pte_name;

			this.projectPjList.forEach(item => {
				if (item.pte_id == this.S_pte_name) {
					return (this.S_pte_name = item.pte_name);
				}
			});

			// 处理文件
			if (this.addFormData.annex) {
				this.detailsImgList = this.addFormData.annex;
				this.submitImgList = this.addFormData.annex;
			}
			// 处理表格
			if (this.addFormData.member_json) {
				this.pj_users = this.addFormData.member_json;
			}
			// 处理时间
			if (this.addFormData.start_date) {
				this.start_date = this.addFormData.start_date;
			}
			if (this.addFormData.end_date) {
				this.end_date = this.addFormData.end_date;
			}
			// 处理签名
			if (this.addFormData.sign_manager) {
				this.v = this.addFormData.sign_manager;
			}
			console.log('项目组任命书', this.addFormData);
		},

		// 签名
		async startSign1() {
			this.vShow = true;
		},
		// 获取签名图片
		getImg(e) {
			this.v = e;
			this.vShow = false;
			console.log(this.v);
		},
		// 签名

		// 文件上传
		upLoadChange(data) {
			console.log('文件列表', data);
			this.submitImgList = data;
		},
		inputData(e, item) {},
		// 项目组长签名
		async startSign2() {
			let s = await this.$refs.sig.getSyncSignature();
			this.s2 = s;
			console.log('组件版本', this.$refs.sig.VERSION);
			console.log('签名数据', s);
		},
		// 删除成员
		deleteUser(index) {
			this.pj_users.splice(index, 1);
		},
		//添加成员
		addUser() {
			this.pj_users.push({
				nickname: '',
				number: '',
				major: '',
				work: ''
			});
		},
		//设置结束时间
		setDate2(e) {
			this.end_date = e.detail.value;
		},
		//设置开始时间
		setDate1(e) {
			this.start_date = e.detail.value;
		},
		// 点击右下文件按钮
		fbtnClick() {
			console.log(this.pj_users);
		},
		/* 
			点击返回 
			 */
		back() {
			// uni.navigateBack({
			// 	delta: 1
			// });
			uni.redirectTo({
				url: '/packageProject/pages/project/projectManagement'
			});
		},
		// 获取评价类型
		async getPjTypeList() {
			const { data: res } = await this.$myRequest({
				url: 'Project/evaluation_type',
				method: 'POST',
				data: {
					member_id: this.member_id,
					token: this.token,
					company_id: this.company_id
				}
			});
			if (res.code != 200)
				return uni.showToast({
					title: res.datas.msg,
					icon: 'none'
				});
			this.projectPjList = res.datas.listInfo;
			this.projectPjList.push({
				pte_id: '-1',
				pte_name: '其他',
				checked: false
			});
			console.log('评价类型列表', this.projectPjList);
		}
	}
};
</script>

<style lang="scss">
.xiaolu {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 50rpx;
	z-index: 1500;
}

.qianzi1 {
	display: flex;
	justify-content: flex-end;
}

.qianzi {
	font-size: 25rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #333333;
	display: flex;
	flex-direction: column;
}

.work_text2 {
	font-size: 24rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #333333;
	margin-top: 40rpx;
}

.work_text1 {
	display: flex;
	flex-direction: column;
	font-size: 24rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #666666;
}

.line_item {
	width: auto;
	height: 52rpx;
	border: 1rpx solid #ebebeb;
	line-height: 52rpx;
	text-align: center;
}

.line {
	font-size: 20rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #333333;
	display: flex;
	flex-direction: row;
}

.add_user {
	width: 170rpx;
	height: 54rpx;
	background: #40a0f2;
	border-radius: 27rpx;
	font-size: 24rpx;
	font-family: PingFang SC;
	font-weight: bold;
	color: #ffffff;
	line-height: 54rpx;
	text-align: center;
	margin-left: 330rpx;
}

.picker1 {
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #999999;
	margin-top: 42rpx;
}

.date {
	width: 32rpx;
	height: 32rpx;
	position: absolute;
	right: 51rpx;
	top: 90rpx;
}

.fbtn {
	position: fixed;
	left: 592rpx;
	bottom: 120rpx;
	z-index: 5;

	image {
		width: 134rpx;
		height: 134rpx;
	}
}

.bottom {
	width: 100%;
	height: 88rpx;
	margin-top: 202rpx;
}

.bottom_btn {
	width: 375rpx;
	height: 88rpx;
	margin-left: 0;
	border-radius: 0;
	font-size: 32rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #ffffff;
}

.bottom2 {
	width: 100%;
}
.bottom_btn2 {
	width: 34%;
	height: 88rpx;
	border-radius: 0;
	position: fixed;
	bottom: 0;
	font-size: 32rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: #ffffff;
	z-index: 999;
}

.info_item {
	width: 690rpx;
	height: auto;
	border-bottom: 1rpx solid #e3e3e3;
	margin-left: 30rpx;
	margin-top: 44rpx;
}

.head_text {
	width: 100%;
	height: 128rpx;
	font-size: 36rpx;
	font-family: PingFang SC;
	font-weight: bold;
	color: #333333;
	line-height: 160rpx;
	text-align: center;
}
.texta {
		width: 690rpx;
		height: 200rpx;
		background: #f7f7f7;
		margin-top: 30rpx;
		padding-top: 20rpx;
		padding-bottom: 20rpx;
	}
</style>
